<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户管理</title>
<!-- css 样式引入 -->
<link rel="stylesheet" type="text/css"
	href="../../css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css"
	href="../../css/bootstrap-table.css" />
<link rel="stylesheet" type="text/css"
	href="../../css/font-awesome.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/index.css">
<!-- js引入 -->
<script type="text/javascript" src="../../js/jquery.min.js"></script>
<script type="text/javascript" src="../../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../js/bootstrap-table.js"></script>
<script type="text/javascript" src="../../js/bootstrap-table-zh-CN.js"></script>
<script src="../../js/common.js"></script>
<script src="../../laydate/laydate.js"></script>
<script src="js/distributorList.js"></script>

<style>
.demo-input {
	padding-left: 10px;
	height: 38px;
	min-width: 262px;
	line-height: 38px;
	border: 1px solid #e6e6e6;
	background-color: #fff;
	border-radius: 2px;
}

.demo-footer {
	padding: 50px 0;
	color: #999;
	font-size: 14px;
}

.demo-footer a {
	padding: 0 5px;
	color: #01AAED;
}
</style>
</head>
<body>
	<!-- 标题 -->
	<table class="btbHead">
		<tr>
			<td style="width: 25%;"><i class="fa fa-align-justify"></i>&nbsp;用户管理</td>
			<td style="text-align: right;"><a href="#" id="addBtn"
				class="btn btn-info" data-toggle="modal" data-target="#addModal"><i
					class="fa fa-plus"></i>&nbsp;添加</a></td>
		</tr>
	</table>

	<!-- 模糊查询条件 -->
	<form role="form" class="form-inline searchForm">
		<div class="form-group">
			<label for="name">查询条件</label> <input type="text"
				class="form-control" id="keyWord" placeholder="请输入昵称"
				style="width: 250px;"> <a href="javascript:doQuery()"
				class="btn btn-default"><i class="fa fa-search"></i></a>
		</div>
	</form>

	<div class="slideLine" style="margin-top: 10px; margin-bottom: 10px;"></div>

	<!-- 数据表格 -->
	<table id="userTable" data-toggle="table" class="dataTable"
		data-pagination="true">
		<thead>
			<tr>
				<th data-field="id" data-align="center">用户编号</th>
				<th data-field="loginName" data-align="center">用户名</th>
				<th data-field="nickName" data-align="center">昵称</th>
				<th data-field="phone" data-align="center">手机号码</th>
				<th data-field="currentType" data-align="center">用户类型</th>
				<th data-field="gender" data-align="center" data-formatter="genderFormatter">性别</th>
				<th data-field="createTime" data-align="center"
					data-formatter="dateFormatter">注册时间</th>
				<th data-field="lastLoginTime" data-align="center"
					data-formatter="dateFormatter">上次登录时间</th>
				<th data-field="opraite" data-align="center"
					data-formatter="operateFormatter">操作</th>
			</tr>
		</thead>
	</table>

	<!--增加 模态框-->
	<div class="modal fade" id="addModal" tabindex="-1" role="dialog"
		aria-labelledby="addModalLabel" aria-hidden="true">
		<div class="modal-dialog" style="width: 700px;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">新增用户信息</h4>
				</div>
				<div class="modal-body" id="iptBox">
					<form class="form-horizontal form-inline commitForm commitForm_a" role="form">
						<table>
							<tr>
								<td style="text-align: right;">状态</td>
								<td class=""><select class="form-control" id="a_state"
									name="state" style="width: 100%">
										<option value="1">有效</option>
										<option value="0">无效</option>
								</select></td>
								<td style="text-align: right;">审核状态</td>
								<td><select class="form-control" id="a_auditStatus"
									name="auditStatus" style="width: 100%">
										<option value="0">待审</option>
										<option value="1">通过</option>
										<option value="2">未通过</option>
								</select></td>
							</tr>
							<tr>
								<td style="text-align: right;">当前身份</td>
								<td><select class="form-control" id="" name="userType"
									style="width: 100%">
										<option value="0">管理员</option>
										<option value="1">分销商</option>
								</select></td>
								<td style="text-align: right;">初始账户金额</td>
								<td><select class="form-control" id="a_countMoney"
									name="countMoney" style="width: 100%">
										<option value="0">10000</option>
										<option value="1">20000</option>
										<option value="2">30000</option>
								</select></td>
							</tr>
							<tr>
								<td style="text-align: right; width: 15%;">用户名称</td>
								<td width=""><input id="a_loginName" class="form-control"
									name="loginName" type="text" style="width: 100%"></td>
								<td style="text-align: right; width: 17%;">用户email</td>
								<td width=""><input id="a_email" class="form-control"
									name="email" type="text" style="width: 100%"></td>
							</tr>
							<tr>
								<td style="text-align: right;">手机号码</td>
								<td><input id="a_phone" class="form-control" name="phone"
									type="text" style="width: 100%"></td>
								 <td style="text-align: right;">上级分销商</td>
								<td><input id="a_parent" class="form-control"
									name="parentId" type="text" style="width: 100%"></td>
							</tr>

							<tr>
								<td style="text-align: right; width: 15%;">交易密码</td>
								<td width=""><input id="a_tradePassword"
									class="form-control" name="tradePassword" type="text"
									style="width: 100%"></td>
								<td style="text-align: right; width: 15%;">身份证号</td>
								<td width=""><input id="a_idCard" class="form-control"
									name="idCard" type="text" style="width: 100%"></td>
							</tr>
							<tr>
								<td style="text-align: right; width: 17%;">生日</td>
								<td width=""><input type="text" class="demo-input"
									name="birthday" placeholder="请选择日期" id="test2"></td>
								<td style="text-align: right;">性别</td>
								<td><select id="a_gender" class="form-control"
									name="gender" style="width: 100%">
										<option value="0">男</option>
										<option value="1">女</option>
								</select></td>
							</tr>
							<tr>
								<td style="text-align: right;">登录密码</td>
								<td><input id="a_loginPassword" class="form-control"
									name="loginPassword" type="text" style="width: 100%"></td>
								<td style="text-align: right;">昵称</td>
								<td><input id="a_nickName" class="form-control"
									name="nickName" type="text" style="width: 100%"></td>
							</tr>
							<tr>
								
							</tr>
						</table>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消
					</button>
					<button type="button" class="btn btn-primary" id="btnSave">
						保存</button>
				</div>
			</div>
			<!-- /.modal-content-->
		</div>
		<!--/.modal -->
	</div>

	<!--修改 模态框-->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog" style="width: 700px;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">修改信息</h4>
					<span id="muid" style="display: none"></span>
				</div>
				<div class="modal-body" id="iptBox">
					<form class="form-horizontal form-inline commitForm" role="form">
						<table>
							<tr>
								<td style="text-align: right; width: 15%;">用户名称</td>
								<td width=""><input id="m_loginName" class="form-control"
									type="text" style="width: 100%" readonly="true"></td>
							</tr>
							<tr>
								<td style="text-align: right;">性别</td>
								<td><span id="m_gender" class="m_gender"></span></td>
								<td style="text-align: right;">密码</td>
								<td><input id="m_loginPassword" class="form-control"
									name="loginPassword" type="text" style="width: 100%"
									readonly="true"></td>
							</tr>
							<tr>
								<td style="text-align: right;">手机号码</td>
								<td><input id="m_phone" class="form-control" name="m_phone"
									type="text" style="width: 100%"></td>
								<td style="text-align: right;">昵称</td>
								<td><input id="m_nickName" class="form-control"
									name="m_nickName" type="text" style="width: 100%"></td>
							</tr>
							<tr>
								<td style="text-align: right;">注册时间</td>
								<td><span id="m_registerTime"></span></td>
							</tr>

						</table>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消
					</button>
					<button type="button" class="btn btn-primary" onclick="modify()">
						保存</button>
				</div>
			</div>
			<!-- /.modal-content-->
		</div>
		<!--/.modal -->
	</div>

	<!--  删除模态框  -->
	<div class="modal fade" id="delModal" tabindex="-1" role="dialog"
		style="width: 400px; margin: auto; margin-top: 10%;">
		<div class="dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span> <span id="uid"
							style="display: none"></span>
					</button>
					<h4 class="modal-title">删除用户</h4>
				</div>
				<div class="modal-body">
					<p class="modal-username">确认删除用户？</p>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary" id="delBtu"
						onclick="del()">删除</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
</body>
<script>
	//删除模态框事件监听
	$('#delModal').on(
			'show.bs.modal',
			function(event) {
				var button = $(event.relatedTarget)
				var uid = button.data('uid')
				var uname = button.data('uname')
				var modal = $(this)
				$("#uid").text(uid);
				modal.find('.modal-username').text('是否删除用户 ：' + uname + ", 删除以后不能恢复，请谨慎操作！");
				console.log($("#uid").text());
			})

	// 修改模态框监听
	$('#myModal').on(
			'show.bs.modal',
			function(event) {
				var button = $(event.relatedTarget)
				var uid = button.data('uid')
				var uname = button.data('uname')
				var nickName = button.data('nick')
				var gender = button.data('gender') == 0 ? "女" : "男";
				var loginPassword = button.data('password')
				var phone = button.data('phone')
				var registerTime = button.data('registertime')
				var modal = $(this)
				$("#muid").text(uid);
				modal.find('#m_loginName').val(uname);
				modal.find('#m_nickName').val(nickName);
				modal.find('#m_gender').text(gender);
				modal.find('#m_loginPassword').val(loginPassword);
				modal.find('#m_phone').val(phone);
				modal.find('#m_registerTime').text(
						new Date(registerTime).Format("yyyy-MM-dd hh:mm:ss"));
			});
</script>
</html>